<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title></title>

    <link th:href="@{/bootstrap-3.3.7-dist/css/bootstrap.min.css}" rel="stylesheet">
    <script type="text/javascript" th:src="@{/webjars/jquery/3.3.1/jquery.js}"></script>
    <script src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"
            integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa"
            crossorigin="anonymous"></script>

    <style type="text/css">
        .top-buffer {
            margin-top: 40px;
        }
        td{
            min-width: 30px;
            max-width: 50px;
            overflow: hidden;
        }

        td:hover{
            overflow: visible;
        }


    </style>

</head>
<body>
<div class="container">
    <div class="row">
<!--        <div class="col-md-6">-->
<!--            <h1>WenZhou University-SSM</h1>-->
<!--        </div>-->
        <div class="col-md-6"  style="width:100%;float: left;padding-left:12%;margin-top: 3%">
            <form action="/" method="get" style="width:20%;display:inline;float:left">
                <button class="btn btn-primary" type="submit" >返回</button>
            </form>
            <form action="/login" method="post" style="width:20%;display:inline;float:right">
                <button class="btn btn-primary" type="submit">管理员登录</button>
            </form>
<!--            <h4 class="text-right">当前账户：<span th:text="${session.sharperinfo.sharperName}"></span></h4>-->
        </div>
    </div>
    <div class="row top-buffer">
        <div class="col-md-10"  th:if="${pageInfo} ne null" type="" style="margin-left: 10%">
            <div class="row">
                <div th:if="${param} ne null">
                    <div id="url" style="display: none" th:value="'sid='+${param.sid}+'&sname='+${param.sName}+'&type='+${param.type}"></div>
                </div>
                <div class="col-md-4 col-md-offset-10" style="margin-left: 0;width: 100%"
                    >
                    <b>模具编号：</b> <input type=""  placeholder="输入模具编号" id="search_sid" >
                    <b>名称：</b> <input type=""  placeholder="输入模具名称" id="search_sname" >
                    <b>种类：</b> <input type="" placeholder="输入模具种类" id="search_type">
                    <button class="btn btn-primary" id="searchSharper"
                            th:search_url="'/sharper/listsharpers?'"
                    >查询</button>
                </div>
            </div>
            <div class="row">
                <div class="col-md-12">
                    <table class="table table-hover" id="emps_table">
                        <thead>
                        <tr>
                            <th>编号</th>
                            <th>名称</th>
                            <th>种类</th>
                            <th>状态</th>
                            <th>借用人</th>
                            <th>位置</th>
                            <th>时间</th>
                            <th>操作</th>
                        </tr>
                        </thead>
                        <tbody>
                        <tr th:each="sharper : ${sharpers}">
<!--                            <td><input type='checkbox' class='check_item' th:value="${sharper.sharperCode}"/></td>-->
                            <td th:text="${sharper.sid}"></td>
                            <td th:text="${sharper.sName}"></td>
                            <td th:text="${sharper.type}"></td>
                            <td th:text="${sharper.statename}"></td>
                            <td th:text="${sharper.username}"></td>
                            <td th:text="${sharper.mechine}"></td>
                            <td th:text="${sharper.date}"></td>
                            <td>
                                <button
                                class="btn btn-primary sharper_borrow_btn"
                                data-toggle="modal"
                                th:attr="value=${sharper.sid}"
                                data-target="#myModal_edit">借
                                </button>
                                <button
                                        th:attr="back_url=@{/sharper/back/} + ${sharper.sid}"
                                        class="btn btn-danger emp_back_btn"
                                        >还
                                </button>
                            </td>
                        </tr>
                        </tbody>
                    </table>
                </div>

            </div>

            <!-- 显示分页信息 -->
            <div class="row">
                <!--分页文字信息  -->
                <div class="col-md-6" id="page_info_area">一页5条记录，
                    当前<span th:text="${pageInfo.pageNum}"></span>页，
                    总<span th:text="${pageInfo.pages}"></span>页，
                    总<span th:text="${pageInfo.total}"></span>条记录
                </div>
                <!-- 分页条信息 -->
                <div class="col-md-6" id="page_nav_area">
                    <ul class="pagination">
                        <li><span class="page" th:search_url="'/sharper/listsharpers?pageNow='+${pageInfo.firstPage}+'&'">首页</span></li>
                        <li><span class="page" th:search_url="'/sharper/listsharpers?pageNow='+${pageInfo.prePage} +'&'">前一页</span></li>
                        <li th:each="p : ${pageInfo.navigatepageNums}">
                            <span th:search_url="'/sharper/listsharpers?pageNow='+${p}" th:text="${p}"></span>
                        </li>
                        <li><span class="page" th:search_url="'/sharper/listsharpers?pageNow='+${pageInfo.nextPage}+'&'">下一页</span></li>
                        <li><span class="page" th:search_url="'/sharper/listsharpers?pageNow='+${pageInfo.lastPage}+'&'">末页</span></li>
                    </ul>
                </div>
            </div>


            <!--<借用磨具-->
            <div class="modal fade" id="myModal_edit" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
                <div class="modal-dialog" role="document">
                    <div class="modal-content">
                        <div class="modal-header">
                            <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                            <h4 class="modal-title" id="myModalLabel_edit">借用磨具</h4>
                        </div>
                        <div class="modal-body">
                            <form>
                                <div class="form-group"  id="sharper_borrow">
                                </div>
                                <div class="form-group"  id="borrower">借用人：
                                    <select>
                                    </select>
                                </div>
                                <div class="form-group" id="mechine">机器：
                                    <select>
                                    </select>
                                </div>
                            </form>
                        </div>
                        <div class="modal-footer">
                            <button type="button" class="btn btn-default" data-dismiss="modal">取消</button>
                            <button
                                    type="button"
                                    class="btn btn-primary"
                                    id="btn-borrow">保存</button>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>


</div>

<script type="text/javascript">

    $('#btn-edit').click(function () {
        var id=$('#edit_id').val();
        var name=$('#edit_name').val();
        var phone=$('#edit_email').val();
        var gender=$("input[class='edit_sex']:checked").val();
        if(gender=='女'){
            gender=1
        }else {
            gender=2
        }
        alert(id);
        $.ajax({
            type:"PUT",
            url:"/sharper/edit",
            dataTye:'JSON',
            data:{'id':id,'sharperName':name,'phone':phone,'gender':gender},
            //请求成功
            success : function(result) {
                console.log(result);
                alert("保存成功");
                location.href="/sharper/listsharpers";
            },
            //请求失败，包含具体的错误信息
            error : function(e){
                console.log(e.status);
                console.log(e.responseText);
                alert("保存失败");
            }
        })
    });

    $('#btn-add').click(function () {
        var sharperCode=$('#add_sharperCode').val();
        var sharperName=$('#add_sharperName').val();
        var gender=$("input[type='radio']:checked").val();
        var phone=$('#add_sharperPhone').val();
        if(gender=='女'){
            gender=1
        }else {
            gender=2
        }
        // alert(sharperCode);
        // alert(sharperName);
        // alert(gender);
        // alert(phone);
        $.ajax({
            type:"POST",
            url:"/sharper/add",
            dataTye:'JSON',
            data:{'sharperCode':sharperCode,'sharperName':sharperName,'gender':gender,'phone':phone},
            //请求成功
            success : function(result) {
                console.log(result);
                alert("添加成功");
                location.href="/sharper/listsharpers";
            },
            //请求失败，包含具体的错误信息
            error : function(e){
                console.log(e.status);
                console.log(e.responseText);

                alert("添加失败");
            }
        })
    });

    $('.emp_back_btn').click(function () {
        $link =$(this).attr('back_url');
        if(confirm("确定归还？")){
            $.ajax({
                type : "POST",
                url : $link,
                //请求成功
                success : function(result) {
                    console.log(result);
                    if(result==1){
                        alert("归还成功");
                        location.reload()
                    }
                    else{
                        alert("归还失败");
                    }

                },
                //请求失败，包含具体的错误信息
                error : function(e){
                    alert("归还失败");
                }
            });
        }
    });

    $('.sharper_borrow_btn').click(function () {
        var sid=$(this).val();
        $("#sharper_borrow").text("模具："+$(this).val());
        $.ajax({
            type: "GET",
            url: "/mechine/getMechines",
            //请求成功
            success: function (result) {
                getMechine(result);
            },
            //请求失败，包含具体的错误信息
            error: function (e) {
                alert("获取失败");
            }
        });
        $.ajax({
            type: "GET",
            url: "/user/getUsers",
            //请求成功
            success: function (result) {
                console.log(result);
                getUsers(result);
            },
            //请求失败，包含具体的错误信息
            error: function (e) {
                alert("获取失败");
            }
        });
        $('#btn-borrow').click(function () {
            var user=$('#borrower').find("select").val();
            var mechine=$('#mechine').find("select").val();
            console.log(sid);
            $.ajax({
                type: "POST",
                url: "/sharper/borrow",
                data:{"sid":sid,"user":user,'sPosition':mechine},
                //请求成功
                success: function (result) {
                    if(result==1){
                        alert("借取成功");
                        location.reload()
                    }
                    else{
                        alert("借取失败");
                    }
                },
                //请求失败，包含具体的错误信息
                error: function (e) {
                    alert("获取失败");
                }
            });
        });
    });
    function getUsers(result) {
        $('#borrower').find('select').find('option').remove();
        $.each(result, function(index,user){
                $('#borrower').find('select').append(
                "<option value='"+user['id']+"'>"+user['userName']+"</option>"
            );
        });
    }
    function getMechine(result) {
        $('#mechine').find('select').find('option').remove();
        $.each(result, function(index,mechine){
            if(mechine['mid']!=0){
                $('#mechine').find('select').append(
                "<option value='"+mechine['mid']+"'>"+mechine['mname']+"</option>"
                );
            }
        });

    }

    $('#searchSharper').click(function () {
        var sid=$('#search_sid').val();
        var sname=$('#search_sname').val();
        var type=$('#search_type').val();
        $link=$(this).attr('search_url');
        url="sid="+sid+"&sname="+sname+"&type="+type
        location.href=$link+url;
    });
    $('.page').click(function () {
        $link=$(this).attr('search_url');
        url=decodeURI(decodeURI(window.location.search)).split("?")[1];
        location.href=$link+url;
    });
</script>

</body>
</html>